<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        /*div div{*/
        /*width: 100px;*/
        /*height: 100px;*/
        /*background: green;*/
        /*}*/

        /*.warp div {*/
        /*width: 100px;*/
        /*height: 100px;*/
        /*background: green;*/
        /*}*/

        .warp #div2 {
            width: 100px;
            height: 100px;
            background: green;
        }
    </style>
</head>
<body>
<!--
     包含选择器             通过范围选择元素，选择到的可能是一个元素，也可能是多个元素
          语法             父级 目标元素{样式}
                          父级与目标元素都可以是任意一种选择器选择到的元素



-->

<div class="warp">div1
    <div id="div2">div2</div>
</div>
</body>
</html>